/*
	头部滚动插件
	header: 头部dom
	banner: 滚动变色的高度
	toggleCls: 切换样式
*/
define(['backbone'], function(Backbone) {

	var HeaderScroll = Backbone.View.extend({
		initialize: function(opt) {
			var options = {
				header: '.com-header',
				banner: '.swiper-container',
				toggleCls: 'is-scrolled'
			}
			this.Options = _.extend({}, options, opt);
			this.renderEls();
			this.evt_toggleScroll();
			this.bindEvents();
		},
		renderEls: function() {
			this.els = {
				header: $(this.Options.header),
				banner: $(this.Options.banner)
			}
		},
		bindEvents: function() {
			$(window).off('scroll.toggleHeader').on('scroll.toggleHeader', _.bind(this.evt_toggleScroll, this));
		},
		evt_toggleScroll: function() {
			var scrollTop = $(window).scrollTop();
			var maxTop = this.els.banner.height();
			if (scrollTop >= maxTop) {
				this.els.header.addClass(this.Options.toggleCls);
			} else {
				this.els.header.removeClass(this.Options.toggleCls);
			}
		}
	});

	return HeaderScroll;

});